import AIcon from 'react-native-vector-icons/AntDesign';
import MIcon from 'react-native-vector-icons/MaterialIcons';
import { mergeStyles } from "../themes";
import { useGlobalStore } from "../mobx";
import { StyleProp,  TextStyle } from "react-native";
import { observer } from "mobx-react-lite";

interface IconProps {
    name: string
    style?: StyleProp<TextStyle>
    themeStyle?: Record<string, any>
    size?: number
    type?: 'a' | 'm'
}
export const IconBox = observer((props: IconProps) => {
    const { type, name, style, themeStyle, size = 18 } = props
    const { theme } = useGlobalStore()
    if (type === 'm') {
        return <MIcon name={name} style={mergeStyles({ style, theme, themeStyle: { color: 'color_3', ...themeStyle } })} size={size}  />
    }
    return <AIcon name={name} style={mergeStyles({ style, theme, themeStyle: { color: 'color_3', ...themeStyle } })} size={size}  />
})
